import React from 'react';
import {Table, DatePicker, Select} from 'antd';
import type { TableProps } from 'antd';
interface DataType {
  key: string;
  name: string;
  age: number;
  address: string;
  tags: string[];
}



const LeftTable: React.FC = () =>{
  let ChildRef = React.createRef();
  const clickB = () => {
    ChildRef.current.showModal()
  }

  const columns: TableProps<DataType>['columns'] = [
    {
      title: '#',
      dataIndex: 'name',
      key: 'name',
      width: 60,
      render: (text) => <a>1</a>,
    },
    {
      title: 'RML',
      key: 'no',
      width: 60,
    },
    {
      title: '检验项目',
      ellipsis: true,
      key: 'updateTime',
      width: 160,
    },
    {
      title: '检验项目',
      ellipsis: true,
      key: 'adminName',
      width: 120,
    },
    {
      title: '参考范围',
      ellipsis: true,
      key: 'contractType',
      width: 120,
    },
  ];

  const data: DataType[] = [
    {
      key: '1',
      name: '张三',
      age: 32,
      address: 'New York No. 1 Lake Park',
      tags: ['nice', 'developer'],
    },
  ];

  return(<div>
    <div>
      <a>日期</a>
      <DatePicker style={{marginLeft: '6px'}} />
      <a>单元：</a>
      <Select
        defaultValue="1"
        style={{ width: 120 }}
        options={[
          { value: '1', label: '选项1' },
          { value: '2', label: '选项2' },
          { value: '3', label: '选项3' },
          { value: '4', label: '选项4' },
          { value: '5', label: '选项5' },
        ]}
      />
    </div>
    <Table columns={columns} dataSource={data} pagination={false} scroll={{ x: 'max-content' }}/>
    <a>附加信息显示：</a>
  </div>)
}

export default LeftTable;
